<!DOCTYPE html>
<html>
	<head>
		<style>
			html{
							font-size: 75px;
						}
			*{
				margin: 0rem;
				padding: 0rem;
			}
			body{
				font-size="75px";
			}
			.net:after{
				clear: both;
				content: "";
				display: table;
			}
			.fl{
				float: left;
			}
			.fr{
				float: right;
			}
			.head{
				width:100%;
				height:1rem;
				background-color:rgba(232,245,255);
				font-size: 24px;
				font-family: "微软雅黑";	
				position: relative;
				margin-bottom: 0.5rem;
			}
			.head p{
				padding: 0.1rem 0.5rem;
				display: inline-block;
				position: absolute;
				top: 0.17rem;
				left: 0.3rem;
			}
			.head img{
				position: absolute;
				top: 0.26rem;
				left: 0.21rem;
			}
			.head2{
				font-size: 20px;
				position: relative;
				background-color: white;
				height: 1.5rem;
				padding-left: 0.3rem;
				padding-bottom: 0.2rem;
				padding-top: -0.3rem;
			}
			.head3{
				height: 0.05rem;
				background-color: rgb(242,244,245);
			}
			.head4{
				font-size: 23px;
				padding-bottom: 0.3rem;
				padding-left: 0.1rem;
				margin-left: 0.2rem;
				margin-right: 0.2rem;
				border-bottom: 0.01rem solid #ccc;
			}
			.head5{
				font-size: 22px;
				padding-top: 0.2rem;
				padding-left: 0.1rem;
				padding-bottom:1.3rem ;
				margin-left: 0.2rem;
				margin-right: 0.2rem;
				border-bottom: 0.01rem solid #ccc ;
				position: relative;
			}
			.head6{
				margin-top: 0.3rem;
				padding-left: 0.3rem;
			}
			.head7{
				position: fixed;
				bottom: 0rem;
				width: 100%;
				height: 1rem;
				border-top: 0.2rem solid rgb(252,252,252);
				box-shadow: 0.1rem 0.2rem 0.3rem 0.1rem #ccc;
			}
			.kc{
				padding-bottom: 0.2rem;
				font-size: 0.33rem;
				margin-left: 0.4rem;
				color: rgb(123,137,152);
			}
			.xg{
				margin-right: 0.9rem;
				font-size: 20px;
			}
			.sz{
				position: absolute;
				top: 0.5rem;
				left: 0.7rem;
			}
			.fx{
				width: 1rem;
				height: 1rem;
			}
			.head2 img{
				width: 0.2rem;
				height: 0.17rem;
				position: absolute;
				left: 9.3rem;
				top: 0.1rem;
			}
			.dy{
				padding-top: 0.3rem;
				padding-bottom: 0.2rem;
				color:rgb(173,182,191) ;
			}
			.gm{
				padding-bottom: 0.1rem;
			}
			.rq{
				padding-bottom: 0.1rem;
				color: rgb(173,182,191);
			}
			.qian{
				color: red;
			}
			.yh{
				position: absolute;
				top: 1rem;
				left: 8.1rem;
				color: rgb(173,182,191);
			}
			.wyh{
				color: rgb(173,182,191);
			}
			.pt{
				position: absolute;
				top: 1rem;	 
			}
             .tg{
				 position: absolute;
				 top: 0.7rem;
				 left:0. 3rem;
				 padding-top: 0.3rem;
				 font-size: 24px;
			 }
			 form{
				 margin-top: 2rem;
				 font-size: 25px;
				 margin-left:0.3rem;
			 }
			 a{
				 text-decoration: none;
			 }
			 .pay1{
				 position: absolute;
				 top: 0.1rem;
				 left: 0.7rem;
				 font-size: 26px;
				 color: rgb(173,182,191);
			 }
			 .pay2{
				 font-size: 26px;
				 color: red;
				 position: absolute;
				 left: 2.5rem;
				 top: 0.13rem;
			 }
			 .pay3{
				 position: absolute;
				 left: 5rem;
				 bottom: 0.2rem;
				 width: 3.4rem;
				 height: 0.7rem;
				 line-height: 0.7rem;
				 border-radius: 0.5rem;				
				 background-color:rgb(251,0,65);
				 text-align: center;
			 }
			 
			 
			 
			 
			 .pay3 a{
				 font-size: 27px;
				 color: white;
				 background-color: rgb(251,0,65);
				 border: none;
			 }

		</style>
		<script src="http://g.tbcdn.cn/mtb/lib-flexible/0.3.4/??flexible_css.js,flexible.js"></script>
		<meta charset="utf-8">
		<title>确认订单</title>
	</head>
	<body>
		<div class="head">
			<img src="images/img_ljl/qq_ljl.png" />
			<p>张三 &nbsp;正在使用QQ账号购买</p>
		</div>
		<div class="head2 net">
			<a href="#"><img src="images/img_ljl/right_ljl.png" /></a>
			<div class="kc fl">课程发送提醒至</div>
			<div class="xg fr"><a href="#">修改</a></div>
			<div class="sz">15805893742</div>
			<div class="tg">
			<input type="checkbox"checked/ style="zoom:150%;">&nbsp;允许机构联系我以便提供教学服务
			</div>
		</div>
		<div class="head3"></div>
		<div class="head4">
			<div class="dy">丁杨晨曦</div>
			<div class="gm">闺蜜力量-穿衣搭配五天速成班</div>
			<div class="rq">第二期 2020-5-25 至 2025-5-7</div>
			<div class="qian">&yen;580.00 &bull;七天包退</div>
		</div>
		<div class="head5 net">
			<div class="jg fl">机构优惠</div>
			<div class="pt fl">平台优惠</div>
			<div class="yh fr">无可用优惠</div>
			<div class="wyh fr">无可用优惠</div>			
		</div>
		<div class="head6">
			<form>
				<input type="checkbox" checked/ style="zoom:150%;">&nbsp;同意<a href="#">《腾讯课堂服务协议》</a>
			</form>
		</div>
		<div class="head7">
			<div class="pay1">实际支付:</div>
			<div class="pay2">&yen;580.00</div>
			<div class="pay3"><a href="#" />去付款</a></div>
		</div>
	</body>
</html>
